// --------------------------------------------------
// 折叠面板
// @Author: steven.wjx
// @Date:   2020-03-05 13:17:50
// --------------------------------------------------
.#{$ui-name}collapse {
	border: 1px solid $border-color;
	border-radius: $border-radius/2;

	.#{$ui-name}collapse-item {
		.#{$ui-name}collapse-head {
			padding: 10px 15px;
			font-size: $font-size;
			line-height: ceil($font-size*1.56);
			background-color: $head-color;
			border-top: 1px solid $border-color;
			cursor: pointer;
			@include clearfix;

			.#{$ui-name}collapse-head-left {
				float: left;

				.hiicon {
					margin-right: 5px;
				}
			}

			.#{$ui-name}collapse-head-right {
				float: right;
			}
		}

		.#{$ui-name}collapse-body {
			padding: 10px 15px;
			display: none;
		}

		&:first-child {
			.#{$ui-name}collapse-head {
				border-top-width: 0;
				border-radius: $border-radius/2 $border-radius/2 0 0;
			}
		}

		&:last-child {
			.#{$ui-name}collapse-head {
				border-radius: 0 0 $border-radius/2 $border-radius/2;
			}
		}

		&.collapse {
			.#{$ui-name}collapse-head {
				border-bottom: 1px solid $border-color;
			}

			.#{$ui-name}collapse-body {
				display: block;
			}
		}
		&.disabled {
			cursor: not-allowed;
			.#{$ui-name}collapse-head {
				color: $disabled-color;
				background-color: $disabled-bg;
			}

			.#{$ui-name}collapse-body {
				color: $disabled-color;
			}
		}
	}
}